import React, { memo, useCallback, useState, useEffect } from 'react';
import { Button, message, Modal, DatePicker, Icon, Form } from 'antd';
import moment from 'moment';

import { isSuccess } from '@/utils/request';
import { salaryRecheck } from '@/services/salaryManage/salaryCalculate';

import rejectStyles from '@/pages/SalaryManage/SalaryCalculate/Recheck/components/CheckHandle/index.less';

const { sendSalaryPayroll, queryIndependentInformation } = salaryRecheck
// 下发薪资条
const SendSalaryPayroll = memo(({ form, handleItem, period, organizationCode, selectedRows, updateStateFn }) => {
    const { getFieldDecorator } = form;

    const [initialTime, setInitialTime] = useState(moment());
    const [modalVisible, setModalVisible] = useState(false)
    const [confirmLoad, setConfirmLoad] = useState(false)

    useEffect(() => {
        if (!period || !modalVisible) {
            return;
        }
        const year = period.substr(0, 4);
        const month = period.substr(5);
        queryIndependentInformation({
                year,
                month,
                organizationCode
            })
            .then(res => {
                if (isSuccess(res) && res.data.lastSalaryPushTime) {
                    setInitialTime(moment(res.data.lastSalaryPushTime));
                }
            });
    }, [period, modalVisible, organizationCode]);

    const handleFn = useCallback(async () => {
        if (selectedRows && selectedRows.length > 0) {
            message.warn('下发薪资单为全量行为，请直接点击按钮');
            return;
        }
        setModalVisible(true)
    }, [selectedRows]);

    const onRejectOk = useCallback(() => {
        form.validateFields(async (errors, value) => {
            if (errors) {
                message.error('请选择日期');
                return;
            }
            const { pushTime } = value;
            setConfirmLoad(true);
            const postValue = {
                pushTime: moment(pushTime).format('YYYY-MM-DD HH:mm')
            };
            const year = period.substr(0, 4);
            const month = period.substr(5);
            const sendRes = await sendSalaryPayroll({
                ...postValue,
                year,
                month,
                organizationCode
            })
            setConfirmLoad(false);
            if (isSuccess(sendRes)) {
                message.success('提交成功');
                setModalVisible(false)
                updateStateFn()
            } else {
                message.success(sendRes.msg)
            }
        });
    }, [form, organizationCode, period, updateStateFn])

    // 限制时间
    const disabledDateTime = value => {
        if (!value) {
            return false;
        }
        return (
            value <
                moment() ||
            value >
                moment()
                    .startOf('day')
                    .add(3, 'd')
        );
    };

    return (
        <>
            <Button key={handleItem.code} onClick={handleFn}>
                {handleItem.name}
            </Button>
            <Modal
                title="下发薪资单确认"
                visible={modalVisible}
                onOk={onRejectOk}
                onCancel={() => setModalVisible(false)}
                destroyOnClose
                centered
                confirmLoading={confirmLoad}
            >
                <div className={rejectStyles.msg}>
                    <Icon type="exclamation-circle" theme="filled" />
                    将于该日期下发薪资单
                </div>
                <Form layout="inline" className={rejectStyles.recheckForm}>
                    <Form.Item label="下发日期">
                        {getFieldDecorator('pushTime', {
                            initialValue: initialTime,
                            rules: [
                                {
                                    required: true,
                                    message: '请选择日期'
                                }
                            ]
                        })(<DatePicker showTime format="YYYY-MM-DD HH:mm" disabledDate={disabledDateTime} />)}
                    </Form.Item>
                </Form>
            </Modal>
        </>
    );
});

export default memo(Form.create()(SendSalaryPayroll))
